<!DOCTYPE HTML>
<html>

<head>
	<meta charset="utf-8">
	<title>OBS Log Analyzer</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://bootswatch.com/4/darkly/bootstrap.min.css">
</head>

<body>
	<div class="container">
		<div class="page-header my-5" id="banner">
			<div class="row">
				<div class="col-lg-8 col-md-7 col-sm-6">
					<h1>OBS Log Analyzer</h1>
					<p class="lead">Please <a href="https://github.com/obsproject/loganalyzer/issues/new">report</a> all
						crashes together with the log that caused a crash.</p>
				</div>
			</div>
		</div>
		<div class="row no-gutters">
			<p class="lead">
				In OBS select Help &gt; Log Files &gt; Upload last Log File. Copy the URL and paste it here.
			</p>
		</div>
		<div class="row mx-3 no-gutters">
			<div class="col">
				<form method="get" action="">
					<fieldset>
						<div class="form-group">
							<div class="row">
								<div class="input-group">
									<div class="input-group-prepend">
										<span class="input-group-text">Log URL input</span>
									</div>
									<input class="form-control" id="logUrlInput" aria-describedby="urlHelp"
										placeholder="Paste log URL here" value="{ph}" name="url" type="text">
									<div class="input-group-append">
										<button type="submit" class="btn btn-primary">Analyze</button>
									</div>
								</div>
							</div>
						</div>
					</fieldset>
				</form>
			</div>
		</div>
		<div class="row mb-3">
			<div class="col-lg-12">
				<div class="page-header">
					<h2 id="output">Log Analysis <small class="text-muted">of "{description}"</small></h2>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="col">
				<div class="card text-white border-danger mb-3" style="max-width: 20rem;">
					<h5 class="card-header">Critical</h5>
					<div class="card-body">
						{summary_critical}
					</div>
				</div>
			</div>
			<div class="col">
				<div class="card text-white border-warning mb-3" style="max-width: 20rem;">
					<h5 class="card-header">Warning</h5>
					<div class="card-body">
						{summary_warning}
					</div>
				</div>
			</div>
			<div class="col">
				<div class="card text-white border-info mb-3" style="max-width: 20rem;">
					<h5 class="card-header">Info</h5>
					<div class="card-body">
						{summary_info}
					</div>
				</div>
			</div>
		</div>
		{details}
	</div>
</body>

</html>